<template>
	<view class="personal" style="height: 100%;
	display: flex;
	flex-direction: column;
	background: url('../../../static/image/background1.png') no-repeat center;
	background-size: cover;">
		<view class="title">个人中心</view>
		<view class="userinfo">
			<view class="text">
				<text class="userhead" style="color:#fff;font-size:12px;">头像</text>
				<text class="userimg" style="font-size:14px;color:#fff;">{{userinfo.userimg}}</text>
			</view>
			<view class="text">
				<text class="loginuser" style="color:#fff;font-size:12px;">登录名</text>
				<text class="loginname" style="font-size:14px;color:#fff;">{{userinfo.account}}</text>
			</view>
			<view class="text">
				<text class="username" style="color:#fff;font-size:12px;">真实姓名</text>
				<text class="username" style="font-size:14px;color:#fff;">{{userinfo.userName}}</text>
			</view>
			<view class="text">
				<text class="role" style="color:#fff;font-size:12px;">角色</text>
				<text class="role" style="font-size:14px;color:#fff;" v-for="item in userinfo.roleSimpleOutputDTOList" :key="item.roleID">{{item.roleName}}</text>
			</view>
			<view class="text">
				<text class="form" style="color:#fff;font-size:12px;">组织</text>
				<text class="form" style="font-size:14px;color:#fff;">{{userinfo.workUnitName}}</text>
			</view>
			<view class="text">
				<text class="section" style="color:#fff;font-size:12px;">部门</text>
				<text class="section" style="font-size:14px;color:#fff;" v-for="item in userinfo.departmentSimpleOutputDTOList" :key="item.departmentID">{{item.departmentName}}</text>
			</view>
			<view class="text">
				<text class="email" style="color:#fff;font-size:12px;">邮箱</text>
				<text class="email" style="font-size:14px;color:#fff;">{{userinfo.email}}</text>
			</view>
			<view class="text">
				<text class="phone" style="color:#fff;font-size:12px;">电话</text>
				<text class="phone" style="font-size:14px;color:#fff;">{{userinfo.mobile}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		ajax
	} from "../../../api/apis";
	export default {
		data() {
			return {
				userimg: require("../../../static/image/personal_img.png"),
				userinfo: {},
			};
		},
		methods: {
			outlogin() {
				uni.navigateTo({
					url: "../login/login"
				});
			}
		},
		mounted() {
			let _this = this;
			uni.getStorage({
				key: "userid",
				success(res) {
					let id = res.data;
					console.log(res.data)
					ajax({
						url: "/user/getUserAllInfoByID?userID=" + id,
						method: "POST",
						success: res => {
							console.log(res.data.data);
							_this.userinfo = res.data.data
						}
					});
				}
			});
		}
	};
</script>

<style scoped>
	uni-page-body {
	  height: 100%;
	}

	.title {
		font-size: 16px;
		padding: 15px;
		color: #fff;
		text-align: center;
		background: url("../../../static/image/navbg.png") no-repeat center;
	}

	.userinfo {
		padding: 0 20px;
		flex: 1;
		background: none;
	}

	.text {
		border-bottom: 1px solid #e1e1e1;
		width: 100%;
		display: flex;
		justify-content: space-between;
		padding: 12px 0;
		background: none;
	}
</style>
